<template>
  <div>
    <creat v-if="showcreat" @close="showcreat = false" :detailId="detailId" :type="type" @success="refreshList(pageNo)"></creat>
    <check v-else-if="showcheck" @close="showcheck = false"></check>
    <show v-else-if="show" @close="show = false" :detailId="detailId"></show>
    <div v-else>
      <basic-container>
        <!-- <el-header> -->
        <div class="flex_row" style="align-items: flex-start">
          <el-button size="small" type="success" @click="creatNew()" v-if="permission.fxgl_create">新增</el-button>
          <el-form :inline="true" class="ml30" size="small" ref="form" :model="form" @keyup.enter.native="refreshList()">
            <el-form-item label="风险管理编号:"><el-input placeholder="请输入" v-model="form.number" class="w160"></el-input></el-form-item>
            <el-form-item label="风险管理名称:"><el-input placeholder="请输入" v-model="form.name" class="w160"></el-input></el-form-item>
            <el-form-item label="风险管理计划编号:"><el-input placeholder="请输入" v-model="form.planNumber" class="w160"></el-input></el-form-item>
            <el-form-item label="产品名称:"><el-input placeholder="请输入" v-model="form.productName" class="w160"></el-input></el-form-item>
            <el-form-item label="产品编号:"><el-input placeholder="请输入" v-model="form.productCode" class="w160"></el-input></el-form-item>
            <block v-if="showmore">
              <el-form-item label="规格型号:"><el-input placeholder="请输入" v-model="form.skus" class="w160"></el-input></el-form-item>
              <el-form-item label="产品状态:">
                <el-select class="w160" v-model="form.productStatus">
                  <el-option label="正常状态" :value="0"></el-option>
                  <el-option label="故障状态" :value="1"></el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="管理部门:">
                <el-cascader
                  class="w160"
                  placeholder="请选择"
                  ref="newdept"
                  :options="deptOption"
                  v-model="form.manageDeptId"
                  :show-all-levels="false"
                  :props="{
                    value: 'id',
                    label: 'deptName',
                    emitPath: false,
                    checkStrictly: true,
                  }"
                  filterable
                ></el-cascader>
              </el-form-item>
              <el-form-item label="负责人:">
                <el-select class="w160" v-model="form.manageUserId" filterable placeholder="请选择">
                  <el-option v-for="item in userList" :key="item.id" :label="item.name" :value="item.id"></el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="记录保留期限(年):"><el-input placeholder="请输入" v-model="form.retentionPeriod" class="w160"></el-input></el-form-item>
              <el-form-item label="编制部门:">
                <el-cascader
                  class="w160"
                  placeholder="请选择"
                  ref="newdept"
                  :options="deptOption"
                  v-model="form.createDept"
                  :show-all-levels="false"
                  :props="{
                    value: 'id',
                    label: 'deptName',
                    emitPath: false,
                    checkStrictly: true,
                  }"
                  filterable
                ></el-cascader>
              </el-form-item>
              <el-form-item label="编制人:">
                <el-select class="w160" v-model="form.createUser" filterable placeholder="请选择">
                  <el-option v-for="item in userList" :key="item.id" :label="item.name" :value="item.id"></el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="提交日期:">
                <el-date-picker class="w140" v-model="form.beginSubmitDate" type="date" placeholder="开始日期" value-format="yyyy-MM-dd"></el-date-picker>
                -
                <el-date-picker class="w140" v-model="form.endSubmitDate" type="date" value-format="yyyy-MM-dd" placeholder="结束日期"></el-date-picker>
              </el-form-item>
              <el-form-item label="批准日期:">
                <el-date-picker class="w140" v-model="form.beginApproveDate" type="date" placeholder="开始日期" value-format="yyyy-MM-dd"></el-date-picker>
                -
                <el-date-picker class="w140" v-model="form.endApproveDate" type="date" value-format="yyyy-MM-dd" placeholder="结束日期"></el-date-picker>
              </el-form-item>
            </block>
            <el-form-item>
              <el-button type="primary" @click="refreshList(1)">查询</el-button>
              <el-button type="default" plain @click="resetSearch">重置</el-button>
              <el-button type="primary" plain @click="showmore = !showmore">
                更多筛选条件
                <i :class="{ 'el-icon-arrow-down': !showmore, 'el-icon-arrow-up': showmore }"></i>
              </el-button>
            </el-form-item>
          </el-form>
        </div>
        <!-- </el-header> -->
      </basic-container>
      <basic-container>
        <el-table ref="table" :data="tableData" :height="$height - 290 + 'px'" v-loading="loading">
          <el-table-column type="expand" width="1">
            <template slot-scope="scope">
              <div style="margin-left: 850px">
                <div class="flex_center" style="width: 220px" v-for="(item, i) in scope.row.jiluFileList" :key="i">
                  <el-tooltip effect="dark" :content="item.name" placement="top-start">
                    <div class="cell overell pointer" style="width: 110px">{{ item.name }}</div>
                  </el-tooltip>
                  <el-tooltip effect="dark" :content="item.serialNumber" placement="top-start">
                    <div class="cell overell pointer" style="width: 110px">{{ item.serialNumber }}</div>
                  </el-tooltip>
                </div>
              </div>
            </template>
          </el-table-column>
          <el-table-column type="index" width="50" label="序号"></el-table-column>
          <el-table-column prop="number" label="风险管理编号" width="140" show-overflow-tooltip></el-table-column>
          <el-table-column prop="name" label="风险管理名称" width="140" show-overflow-tooltip></el-table-column>
          <el-table-column prop="productName" label="产品名称" width="160" show-overflow-tooltip></el-table-column>
          <el-table-column prop="productCode" label="产品编号" width="80" show-overflow-tooltip></el-table-column>
          <el-table-column prop="skus" label="规格型号" width="80" show-overflow-tooltip></el-table-column>
          <el-table-column label="产品状态" width="80" show-overflow-tooltip>
            <template slot-scope="scope">
              {{ scope.row.productStatus == 0 ? '正常状态' : '故障状态' }}
            </template>
          </el-table-column>
          <el-table-column prop="manageDeptName" label="管理部门" width="80" show-overflow-tooltip></el-table-column>
          <el-table-column prop="manageUserName" label="负责人" width="80" show-overflow-tooltip></el-table-column>
          <el-table-column label="记录文件名称" width="110">
            <template slot-scope="scope">
              <span class="pointer main_co" v-if="!scope.row.expansion" @click="toogleExpand(scope.row)">展开全部 <i class="el-icon-arrow-right ml0 main_co"></i></span>
              <span class="pointer main_co" v-else @click="toogleExpand(scope.row)">收起全部 <i class="el-icon-arrow-down ml0 main_co"></i></span>
            </template>
          </el-table-column>
          <el-table-column label="记录流水编号" width="110"></el-table-column>
          <el-table-column prop="retentionPeriod" label="记录保存年限(年)" width="130"></el-table-column>
          <el-table-column prop="createDeptName" label="编制部门" show-overflow-tooltip></el-table-column>
          <el-table-column prop="createUserName" label="编制人" show-overflow-tooltip></el-table-column>
          <el-table-column label="提交时间" prop="createTime" width="160"></el-table-column>
          <el-table-column prop="issueDate" label="批准日期" width="100">
            <template slot-scope="scope">
              {{ scope.row.beginTime.substr(0, 10) || '-' }}
            </template>
          </el-table-column>
          <el-table-column label="工作流状态" fixed="right" width="100">
            <template slot-scope="scope">
              <span :class="processStatusList[scope.row.processStatus].class">{{ scope.row.processStatus >= 0 ? processStatusList[scope.row.processStatus].text : '-' }}</span>
            </template>
          </el-table-column>
          <el-table-column prop="address" label="操作" fixed="right" width="260">
            <template slot-scope="scope">
              <span class="pointer main_co f14" v-if="permission.fxgl_show" @click="handleShow(scope.row)">查看</span>
              <span class="pointer main_co f14 ml30" v-if="scope.row.ishasDecrypt != 1 && userInfo.user_id == scope.row.createUser" @click="creatNew(scope.row, 2)">快捷新增</span>
              <span class="pointer main_co f14 ml30" @click="applyShow(scope.row)" v-if="scope.row.ishasDecrypt == 1">解密</span>
              <span class="pointer red_f f14 ml30" v-if="permission.fxgl_del && scope.row.processStatus == 7 && userInfo.user_id == scope.row.createUser && scope.row.isShowDel == 1" @click="confirmDel(scope.row)">删除</span>
              <span class="pointer main_co f14 ml30" v-if="userInfo.user_id == scope.row.createUser && permission.fxgl_create && scope.row.isDeleted == '0' && (scope.row.processStatus == 4 || scope.row.processStatus == 5 || scope.row.processStatus == 6)" @click="creatNew(scope.row, 1)"> 修改 </span>
            </template>
          </el-table-column>
          <empty slot="empty"></empty>
        </el-table>
        <el-card class="pub_right">
          <el-pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" :current-page="pageNo" :page-size="pageSize" :total="total" background layout="total, prev, pager, next, jumper"></el-pagination>
        </el-card>
      </basic-container>
    </div>
    <encryption :list="rowFileList" ref="encryption"></encryption>
  </div>
</template>

<script>
import { getguifanList } from '@/api/myapi/tixiwenjian'
import { getuserByDept } from '@/api/myapi/common'
import creat from './creat.vue'
import check1 from './check1.vue'
import check from './check.vue'
import show from './show.vue'
export default {
  components: {
    creat,
    check1,
    check,
    show,
  },
  data() {
    return {
      type: 0,
      tableData: [],
      detailId: '',
      showcreat: false,
      showcheck: false,
      showmore: false,
      show: false,
      pageNo: 1,
      pageSize: 10,
      total: 0,
      loading: false,
      system: 'riskprocess',
      memberOption: [],
      form: {},
    }
  },
  created() {
    this.refreshList(1)
    this.getdeptlist()
    this.getAlluser()
  },
  methods: {
    // 新建文件
    creatNew(row, type) {
      if (row) {
        this.type = type
        this.detailId = row.id
      } else {
        this.type = 0
        this.detailId = ''
      }
      this.showcreat = true
    },
    // 获取数据列表
    refreshList(pageNo) {
      this.showcreat = false
      this.showupgrade = false
      this.loading = true
      this.pageNo = pageNo
      getguifanList(
        {
          current: pageNo,
          size: this.pageSize,
          descs: 'create_time',
          ...this.form,
        },
        this.system
      ).then(({ data }) => {
        if (data && data.success) {
          this.tableData = data.data.records
          this.total = data.data.total
          this.loading = false
        }
      })
    },
    resetSearch() {
      this.form = {}
      this.pageNo = 1
      this.refreshList(this.pageNo)
    },
    getMemberOption(e) {
      getuserByDept({
        deptId: e,
      }).then(({ data }) => {
        if (data && data.success) {
          this.memberOption = data.data
        }
      })
    },
    // 当前页
    currentChangeHandle(val) {
      this.pageNo = val
      this.refreshList(val)
    },
  },
}
</script>

<style scoped="scoped">
::v-deep .el-table__expand-icon {
  font-size: 0;
}
</style>
